30 天影集播放清單 https://www.youtube.com/playlist?list=PLBd8JGCAcUAEFJzjAQC6DbWTeDICcanFF

Youtube 連結：https://www.youtube.com/watch?v=4qsza8cm9TY

在這個系列影集中，我希望跟大家一起研究 Vite 的原始碼，希望通過閱讀 Vite 的原始碼更深入地了解 Vite 的工作原理，並且提升我們的 JavaScript 技能。

今天這集我們來介紹一個相對簡單的主題。

在使用 Vite 開發專案的時候，你可能會遇到需要處理靜態資源的情況。可能是圖片、icon 或其他不需要特別處理的資源，我們可以把它們放在一個叫做 public 的資料夾下。這個資料夾可以讓我們方便地存放這些靜態檔案，並在需要時直接使用。

簡單來說，你可以將任何你希望在網站中使用的靜態資源放在這個 public 資料夾下。這些資源在開發階段可以簡單的取得，並且當你執行專案的建置（build）時，它們會被複製到打包好的專案目錄中的根目錄。

這個 public 資料夾的實現是透過一個叫做 sirv 的 middleware 完成的。在 Vite 專案中，這個 middleware 負責處理靜態資源的提供。

今天的主題相對簡單，但卻是開發 Vite 專案中不可或缺的基礎。在未來的影集中，我會使用我們在影集裡拆解出來的套件，例如實作 middleware 的 connect 以及處理靜態檔案的 sirv 之類的套件，自己也來打造一個陽春版的 Vite，透過自己也做一個的過程更理解 Vite 到底是怎麼做事的。

若各位有其他關於 Vite 或前端開發的問題都歡迎提出。如果你喜歡我的頻道，歡迎幫我的影片按讚、訂閱、轉發我的影片，那對我會有很大的幫助，我們下集見！

參考資料

• sirv https://www.npmjs.com/package/sirv